<template>
	<view class="my-content-info">
		<view class="head">
			<u-avatar :src="src"></u-avatar>
			<view class="title">柜员登录</view>
		</view>
		<view class="login-box">
			<view class="login-li">
				<u--input placeholder="请输入门店编号" border="none" v-model="loginInfo.subStoreId">
					<u--text text="门店" slot="prefix" margin="0 3px 0 0" type="tips"></u--text>
				</u--input>
			</view>
			<view class="login-li">
				<u--input placeholder="请输入账号" border="none" v-model="loginInfo.userName">
					<u--text text="账号" slot="prefix" margin="0 3px 0 0" type="tips"></u--text>
				</u--input>
			</view>
			<view class="login-li"><u--input placeholder="请输入密码" border="none" type="password"
					v-model="loginInfo.password"><u--text text="密码" slot="prefix" margin="0 3px 0 0"
						type="tips"></u--text></u--input></view>
		</view>
		<view class="btn-box" @tap="submit">登录</view>
	</view>
</template>

<script>
	import {
		getStoreData,
		dealNum,
		setStoreData,
		httpPost,
		httpGet,
	} from "@/utils/http.js";
	const pic1 = require(`@/img/my/my1.png`);
	const avatar = require(`@/img/my/avatar1.jpg`);
	export default {
		data() {
			return {
				loginInfo: {
					userName: "",
					password: "",
					subStoreId: "",
				},
				src: ""

			};
		},
		onLoad() {
			this.userInfo = getStoreData("userInfo");


		},
		methods: {
			submit() {
				if (!this.loginInfo.userName) {
					uni.$u.toast("请输入账号");
					return
				}
				if (!this.loginInfo.password) {
					uni.$u.toast("请输入密码");
					return
				}
				httpPost(`/api/sellerstorecashierlogin/loginSubStore`, this.loginInfo)
					.then((res) => {
						console.log(res)
						if (res.data) {

						}

					})
					.catch((e) => {});

			}


		},
	};
</script>

<style lang="scss">
	.my-content-info {
		background-color: #F7F7F7;
		height: calc(100vh - 44px);
		padding-top: 20rpx;

		.head {
			padding: 40rpx;
			text-align: center;
			background-color: #fff;
			margin-left: 30rpx;
			margin-right: 30rpx;
			display: flex;
			flex-direction: column;
			align-items: center;
			justify-content: center;
			border-radius: 20rpx;

			.title {
				margin-top: 20rpx;
			}

		}

		.login-box {
			background-color: #fff;
			border-radius: 20rpx;
			margin-left: 30rpx;
			margin-right: 30rpx;
			padding: 30rpx;
			margin-top: 20rpx;

			.login-li {
				padding-top: 20rpx;
				padding-bottom: 20rpx;
				border-bottom: 2rpx solid #E3E3E3;
			}

			.login-li:nth-child(3) {
				border-bottom: none;
			}
		}

		.btn-box {
			margin-top: 40rpx;
			width: 690rpx;
			background: linear-gradient(to right, #3CBAF6, #56D1FC);
			color: #fff;
			text-align: center;
			height: 100rpx;
			line-height: 100rpx;
			margin-left: 30rpx;
			margin-right: 30rpx;
			border-radius: 20rpx;
		}
	}
</style>